<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<!-- <meta name="viewport" content="width=device-width, initial-scale=1.0"> -->
<link rel="stylesheet" href="css/bootstrap.css" />
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<title>登录</title>
<c:set var="error" value="${error }"  scope="request"/>
<c:if test="error!=null"><script>alert('${error}');</script></c:if>
<script type="text/javascript">
	function isEmpty(obj){
		if(obj.val()==""||obj.val().trim()==""){
			return true;
		}
		return false;
	}
	
	$(function(){
		/*为用户名输入框绑定失去焦点事件，当失去焦点时，设置其后的输出提示文本  */
		$("#inputText3").blur(function(){
			
			if(isEmpty($(this))){
				$(this).fouce();
				$("#chname").html("<font font-size='9px' color='red'>用户名不能为空！</font>"); 
			}else{
				$("#chname").html("");
				$.ajax({
					url:"LoginServlet?name="+$(this).val(),
					type:"GET",
					datatype:"html",
					success:function(data){
						$("#chname").html(data);
					}
				});
			}
		});
		/*为密码输入框绑定失去焦点事件，当失去焦点时，设置其后的输出提示文本  */
		$("#inputPassword3").blur(function(){
			if(isEmpty($(this))){
				$("#chpassword").html("<font font-size='9px' color='red'>密码不能为空！</font>");
			}else{
				$("#chpassword").html("");
			}
		});
	});
	/* 改变验证码 */
    function changeImg(){
        var img = document.getElementById("img"); 
        img.src = "/LeeSir/AuthImage?date=" + new Date();
    }
</script>
<title>LeeSir点餐系统</title>
</head>
<body>
<div>
	<form class="form-horizontal" role="form" action="ActionServlet?action=login" method="post">
  <div class="form-group">
    <label for="inputText3" class="col-sm-2 control-label">用户名</label>
    <div class="col-sm-10">
      <input type="text" class="form-control" id="inputText3" name="name" placeholder="请输入用户名"><br/><div id="chname"></div>
    </div>
  </div>
  <div class="form-group">
    <label for="inputPassword3" class="col-sm-2 control-label">密码</label>
    <div class="col-sm-10">
      <input type="password" class="form-control" id="inputPassword3" name="password" placeholder="请输入密码"><br/><div id="chpassword"></div>
    </div>
  </div>
  <div>
  	<a href='javascript:void(0);'  onclick="javascript:changeImg();" style="color:white;">
	    <img id="img" src="/LeeSir/AuthImage" />  
        <label style="color:#8e8e8e;cursor:pointer">&nbsp;&nbsp;看不清？换一张</label>
        </a>
        <input  class="form-control"  type="text" name="core" id="core" placeholder="请输入验证码"/>
  </div>
  <div class="form-group">
    <div class="col-sm-offset-2 col-sm-10">
      <div class="checkbox">
        <label>
          <input type="checkbox" name="savepwd"> 记住密码
        </label>
      </div>
    </div>
  </div>
  <div class="form-group">
    <div class="col-sm-offset-2 col-sm-10">
      <button type="submit" class="btn btn-default">登录</button><a href="register.jsp">没有账号？注册</a>
    </div>
  </div>
	</form>
</div>
</body>
</html>